import React, { PureComponent } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Table, Card, Form, Pagination, Input, Button, Select } from 'antd'
import { getHandleList } from '../../services/baseurl'
import { isZhongZheng } from '../../utils/utils';
class Index extends PureComponent<any, any> {
    constructor(props: any) {
        super(props);
        this.state = {
            data: [],
            count: 1,
            currentPage: '1',
            name: '',
            id_number: '',
            loading: true,
            is_admin:'0'
        }
    }
    renderList = (page: string) => {
        const { id_number, name,is_admin } = this.state;
        getHandleList({ id_number, name, page,is_admin }).then(res => {
            this.setState({
                data: res.data,
                count: res.count,
                loading: false
            })
        })
    }
    changeValue = (e: any, name: string) => {
        this.setState({
            [name]: e.target.value
        })
    }
    searchHandle = () => {
        this.renderList('1');
        this.setState({
            loading: true,
            currentPage: 1
        })
    }
    changePage = (e: any) => {
        this.renderList(e)
        this.setState({
            loading: true,
            currentPage: e
        })
    }
    componentDidMount() {
        this.renderList('1')
    }
    changeSearchType=(e:any)=>{
        this.setState({
            is_admin:e
        })
    }
    render() {
        const { data, count, loading, currentPage } = this.state;
        const columns = [
            {
                title: '姓名',
                dataIndex: 'name'
            },
            {
                title: '操作',
                dataIndex: 'operation'
            },
            {
                title: '准考证号',
                dataIndex: 'id_number'
            },
            {
                title: 'IP地址',
                dataIndex: 'ip'
            },
            {
                title: '操作时间',
                dataIndex: 'date'
            },
        ]
        return (
            <PageContainer title="系统日志">
                <Card bordered={false}>
                    <div style={{ overflow: 'hidden', marginBottom: 20 }}>
                        <Form style={{ float: 'right' }} layout="inline">
                            {
                                isZhongZheng()&&   <Form.Item>
                                <Select style={{width:120}} onChange={this.changeSearchType} placeholder="请选择筛选条件" defaultValue="0">
                                    <Select.Option key="0" value="0">全部</Select.Option>
                                    <Select.Option key="1" value="1">只看管理员</Select.Option>
                                </Select>
                            </Form.Item>
                            }
                         
                            <Form.Item><Input placeholder="请输入姓名" onChange={(e: any) => this.changeValue(e, 'name')} /></Form.Item>
                            <Form.Item><Input placeholder="请输入准考证号" onChange={(e: any) => this.changeValue(e, 'id_number')} /></Form.Item>
                            <Form.Item><Button type="primary" onClick={this.searchHandle}>搜索</Button></Form.Item>
                        </Form>
                    </div>
                    <Table loading={loading} columns={columns} pagination={false} rowKey="id" dataSource={data}></Table>
                    <Pagination style={{ float: 'right', marginTop: 20 }} current={currentPage * 1} onChange={this.changePage} total={count} showQuickJumper showTotal={(total, range) => `第${range[0]}条-第${range[1]}条，共 ${total} 条`} />
                </Card>
            </PageContainer>
        );
    }
}

export default Index;
